<template>
  <el-dropdown trigger="click" style="margin: 3px 15px 0px 6px" @command="changeLanguage">
    <!-- 这里必须加一个div  @command="changeLanguage"-->
    <div>
      <svg-icon style="color:#fff;font-size:20px" icon-class="language" />
    </div>
    <el-dropdown-menu slot="dropdown">
      <el-dropdown-item :class="{active: $root.$i18n.locale==='zh'}" command="zh">中文</el-dropdown-item>
      <el-dropdown-item :class="{active: $root.$i18n.locale==='en'}" command="en">English</el-dropdown-item>
    </el-dropdown-menu>
  </el-dropdown>
</template>

<script>
import Cookie from 'js-cookie'
export default {
  created() {

  },
  methods: {
    changeLanguage(command) {
      this.$root.$i18n.locale = command // 设置给本地的i18n插件
      Cookie.set('lang', command)
      this.$router.go(0)
      this.$message.success('切换多语言成功')
    }
  }
}
</script>

<style scoped lang="scss">
.active {
  background-color: aqua;
}
</style>
